<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui">
    <h:head>
        <title>Facelet Title</title>
    </h:head>
    <h:body>
        <h:form>         
            <p:dataScroller value="#{productoController.itemsProductos}" var="item" chunkSize="10">

                <h:panelGrid columns="2" style="width:100%" columnClasses="logo,detail">
                    <p:graphicImage name="images/shop/product12.jpg" /> 

                    <p:outputPanel>
                        <h:panelGrid columns="2" cellpadding="5">
                            <h:outputText value="title: " />
                            <h:outputText value="#{item.title}" style="font-weight: bold"/>

                            <h:outputText value="ASIN: " />
                            <h:outputText value="#{item.ASIN}" style="font-weight: bold"/>

                            <h:outputText value="group:" />
                            <h:outputText value="#{item.group}" style="font-weight: bold"/>
                        </h:panelGrid>
                    </p:outputPanel>
                </h:panelGrid>
            </p:dataScroller>
        </h:form>
    </h:body>
</html>

